<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MSG : Event Data</title>
   <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dojo/resources/dojo.css" />
   <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dojox/grid/resources/Grid.css" />
  <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dijit/themes/claro/claro.css" />
  <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dijit/themes/claro/document.css" />
  <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dojox/grid/resources/claroGrid.css" />
  <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dojox/grid/enhanced/resources/claroEnhancedGrid.css" />
  <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dojox/grid/enhanced/resources/EnhancedGrid.css" />
  <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dojox/grid/enhanced/resources/EnhancedGrid_rtl.css" /> 
  <link rel="stylesheet" type="text/css" href="msg.css" />
  
</head>
 
<body class="claro">
	<div>
		<table align="center">
			<tr>
				
				<td><img src="images/NYLiberty.png" width="160" height="90" /></td>
				
				<td>&nbsp;&nbsp;&nbsp;&nbsp;</td>
				<td>
					<table>
						<tr>
							<td><font size="7" face="times new roman" color="#FFFFFF">New York Liberty</font></td>
						</tr>
						
						<tr>
						
							<td align="right"><font size="3" color="#FFFFFF">Ticket
									Sales & Forecast</font></td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
		<img src="images/White_square.png" width="100%" height="1" />
		<br><br/>
			
		
	</div>

	<div id="content">
<!-- Blue Menu -->
		<div id="menu_wrapper" class="blue" >
	 	<div class="left"></div>
			<ul id="menu" >
				<li><a href="/msgSp12/index.html">Upload File</a></li>
				<li><a href="/msgSp12/tGrid.html">TICKET DATA</a></li>
				<li class="active"><a href="/msgSp12/fGrid.html">Forecast</a></li>
				<li><a href="/msgSp12/sfGrid.html">Season Forecast</a></li>
				<li><a href="/msgSp12/sGrid.html">Season Data</a></li>
				<li><a href="/msgSp12/pGrid.html">Price Data</a></li>
				<li><a href="/msgSp12/tgGrid.html">Ticket Group</a></li>
				<li><a href="/msgSp12/TicketsChart.html">CHART VIEW</a>
					<ul>
						<li><a href="/msgSp12/TicketsChart.html">Ticket Sale</a></li>
						<li><a href="/msgSp12/ForecastChart.html">Ticket Forecast</a></li>
					</ul>
				</li>
			</ul>
		</div>

<script type="text/javascript"
        src="http://o.aolcdn.com/dojo/1.6/dojo/dojo.xd.js"
        djConfig="parseOnLoad:true">
</script>
 
<script type="text/javascript">

dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dojox.grid.EnhancedGrid");
dojo.require("dojox.grid.enhanced.plugins.Filter");
dojo.require("dijit.form.ComboBox");
dojo.require("dojo.data.ItemFileReadStore");
dojo.require("dojo.io.iframe");
dojo.require("dojox.grid.enhanced.plugins.exporter.CSVWriter");

           
           var layout = [
           			  { name : "TICKET", field: "Ticket", datatype:"string" , width :"118px"},
           			  {name:"Amount", field:"Amount", dataype:"number", width:"118px"},
           			  {name:"Total Seats", field:"Total_Seats", dataype:"number",width:"118px"},
                         { name : "A", field: "A", datatype:"number" , editable:true,width :"118px"},
                         { name : "B" , field: "B", datatype:"number",editable:true, width :"118px"},
                         { name : "C", field: "C", datatype:"number" , editable:true,width :"118px"},
                         { name : "D" , field: "D", datatype:"number",editable:true, width :"118px"},
                         { name : "E", field: "E", datatype:"number" , editable:true,width :"118px"},
                         { name : "F" , field: "F", datatype:"number", editable:true,width :"118px"},
                         { name : "G", field: "G", datatype:"number" ,editable:true, width :"118px"},
                         { name : "H" , field: "H", datatype:"number",editable:true, width :"118px"}
                      ];



	dojo.ready(function() {
		var xhrArgs = {
			sync : false,
			url : "http://localhost/msgSp12/ActionController",
			handleAs : "json",
			content : {
				requestAction : "events",
			},
			load : fillCombo,
			error : function(error) {
			}
		};
		dojo.xhrPost(xhrArgs);
		createGrid()

	});

	
	function createGrid() {
		var grid = new dojox.grid.EnhancedGrid({
			id : 'grid',
			structure : layout,
			plugins : {
				  exporter: true,
				filter : {
					closeFilterbarButton : true,
					ruleCount : 5,
					itemsName : "Events"
				}
			}
		});
		grid.placeAt('gridContainer');
		grid.startup();
	}

	
	function fillCombo(data) {
		var store = new dojo.data.ItemFileReadStore({
			data : data
		});
		var select = new dijit.form.ComboBox({
			name : "EventCombo",
			placeHolder : "SELECT EVENT",
			store : store,
			searchAttr : "Event_Code",
			onChange : function() {
				var selEvt = dijit.byId("EventCombo").get("value");
			//	alert(selEvt)
				var xhrArgs = {
					sync : false,
					url : "http://localhost/msgSp12/ActionController",
					handleAs : "json",
					content : {
						requestAction : "forecast",
						event : selEvt
					},
					load : fillGrid,
					error : function(error) {
					}
				};

				dojo.xhrPost(xhrArgs);

			}
		}, "EventCombo");
		select.startup();

		/* dojo.connect(select, 'onChange', function(evt){
			
		var selEvt = dijit.byId("EventCombo").get("value");
					alert(selEvt)
					 var xhrArgs = {
					       sync: false, 
					   	   url: "http://localhost/msgSp12/ActionController",
					       handleAs: "json",
					       content: {
					    	   requestAction: "forecast", 
					    	   event: selEvt 
		                   },
					       load: fillGrid,
					       error: function(error) {}
					     };

					   dojo.xhrPost(xhrArgs); 
		  }); */
	}
	function fillGrid(data) {
		var store = new dojo.data.ItemFileWriteStore({
			data : data
		});
		//alert("FillGrid called")

		var grid = dijit.byId("grid");
		grid.setStore(store);
		
	}
	function exportAll() {
		 
		var strall = dijit.byId("grid").exportGrid("csv", function(str) {
			 var form = document.createElement('form');
			dojo.attr(form, 'method', 'POST');
			document.body.appendChild(form);
			dojo.io.iframe.send({
				url : "http://localhost/msgSp12/CSVController",
				form : form,
				method : "POST",
				content : {
					exp : str ,
					type : "Forecast",
					action : "CSV"
				},
			});
			document.body.removeChild(form); 
		});
		
	};
	function exportSelected() {
		 var str = dijit.byId("grid").exportSelected("csv");
		//dojo.byId("output").value = str; 
		 var form = document.createElement('form');
			dojo.attr(form, 'method', 'POST');
			document.body.appendChild(form);
			dojo.io.iframe.send({
				url : "http://localhost/msgSp12/CSVController",
				form : form,
				method : "POST",
				content : {
					exp : str ,
					type : "Forecast",
					action : "CSV"
				},
			});
			document.body.removeChild(form); 

	};   
	function Save() {
		 
	 	var strall = dijit.byId("grid").exportGrid("csv", function(str) {
			 var form = document.createElement('form');
			dojo.attr(form, 'method', 'POST');
			document.body.appendChild(form);
			dojo.io.iframe.send({
				url : "http://localhost/msgSp12/CSVController",
				form : form,
				method : "POST",
				content : {
					exp : dijit.byId("EventCombo").get("value") + ","+ str ,
					type : "Forecast",
					action : "SAVE"
				},
			});
			document.body.removeChild(form); 
		}); 
		
		/*  var str = dijit.byId("grid").exportSelected("csv");
			//dojo.byId("output").value = str; 
			 var form = document.createElement('form');
				dojo.attr(form, 'method', 'POST');
				document.body.appendChild(form);
				dojo.io.iframe.send({
					url : "http://localhost/msgSp12/CSVController",
					form : form,
					method : "POST",
					content : {
						exp :  dijit.byId("EventCombo").get("value") + ","+ str ,
						type : "Forecast",
						action : "SAVE"
					},
				});
				document.body.removeChild(form);  */
		
		
		//alert("Please refresh page to see changes. Rijuta is working on autorefresh")
	};	
</script>

<div id="comboContainer">
<table align="center">

<tr>
<td><label for="Season"><b>SELECT EVENT  </b> </label></td>
<td> <div id="EventCombo" ></div></td>
</tr>


</table>


 <div id="gridContainer" ></div>
    <div> &nbsp;&nbsp;
    </div>
    <center>
    <button style="width: 170px" onclick="Save()"><b>Save and Refresh</b></button>
  <button onclick="exportAll()"><b>Export all to CSV</b></button>
<button onclick="exportSelected()"><b>Export Selected Rows to CSV</b></button> 
</center>
<div id="footer">
        | Copyright © 2012 Team MSG | sp12_msg@cs.nyu.edu | XHTML | CSS | All rights reserved |
    </div>
</div>    
</body>
</html>